<template>
<div>
    <Breadcrumb>
      <BreadcrumbItem>借贷人员审核管理</BreadcrumbItem>
    </Breadcrumb>
     <Divider />

     <!-- 模糊查询 -->
    <div>
        <Input search  enter-button placeholder="Enter something..."  class="ssm"  @click="selectSubmit('formInline')" prop="name"/>
    </div>
  <Table border :columns="columns7" :data="data6" class="table"></Table>
  <Page :total="pageTotal" 
    :current="pageNum" 
    :page-size="pageSize" 
    show-elevator 
    show-sizer 
    show-total 
    placement="top"  
    @on-change="handlePage" 
    @on-page-size-change='handlePageSize'
    class="ye">
    </Page>

  
</div>
</template>
<script>
export default {
  data () {
    return {
      pageTotal: 0, //数据总数
      pageNum: 1, //初始页
      pageSize: 10, //每页条数
      formInline: {
        autitedName: ''
      },
      columns7: [
        {
          type: 'selection',
          width: 60,
          align: 'center'
        },
        {
          title: '编号',
          key: 'autitedId',
          width: 70,
          align: 'center',
          //   render: (h, params) => {
          //   return h('div', [
          //     h('Icon', {
          //       props: {
          //         type: 'person'
          //       }
          //     }),
          //     h('strong', params.row.autitedId)
          //   ])
          // }
        },
        {
          title: '姓名',
          key: 'autitedName',
          width: 120,
          align: 'center',
        },
        {
          title: '性别',
          key: 'autitedGendar',
          width: 70,
          align: 'center'
        },
        {
          title: '身份证号',
          key: 'autitedIdcode',
          align: 'center'
        },
        {
          title: '家庭住址',
          key: 'autitedAddress',
          align: 'center'
        },
        {
          title: '职业',
          key: 'autitedJob',
          align: 'center'
        },
        {
          title: '身份证正面',
          key: 'idcardFront',
          align: 'center'
        },
        {
          title: '身份证反面面',
          key: 'idcardBack',
          align: 'center'
        },
        {
          title: '操作',
          key: 'action',
          width: 150,
          align: 'center',
          render: (h, params) => {
            return h('div', [
              h(
                'Button',
                {
                  props: {
                    type: 'primary',
                    size: 'small'
                  },
                  style: {
                    marginRight: '5px'
                  },
                  on: {
                    click: () => {
                      this.show(params.index)
                    }
                  }
                },
                '通过'
              ),
              h(
                'Button',
                {
                  props: {
                    type: 'error',
                    size: 'small'
                  },
                  on: {
                    click: () => {
                      this.remove(params.index)
                    }
                  }
                },
                '失败'
              )
            ])
          }
        }
      ],
      data6: [
        {
          autitedId: '',
          autitedName: '',
          autitedGendar: '',
          autitedIdcode: '',
          autitedAddress: '',
          autitedJob: '',
          idcardFront: '',
          idcardBack: ''
        },
      ]
    }
  },
  methods: {
    show (index) {
      this.$Modal.info({
        title: '审核通过',
        content: `姓 名： ${this.data6[index].autitedName}<br>性 别： ${this.data6[index].autitedGendar}<br>身份证号： ${this.data6[index].autitedIdcode}
        <br>家庭住址： ${this.data6[index].autitedAddress}<br>职 业： ${this.data6[index].autitedJob}`
      })
    },
    remove (index) {
      this.$Modal.info({
        title: '审核不通过',
        content: `姓 名： ${this.data6[index].autitedName}<br>性 别： ${this.data6[index].autitedGendar}<br>身份证号： ${this.data6[index].autitedIdcode}
        <br>家庭住址： ${this.data6[index].autitedAddress}<br>职 业： ${this.data6[index].autitedJob}`
      })
    },
    //分页
    handlePage(value) {
      console.log(value);
      this.pageNum = value;
      this.getVerify();
    },

    handlePageSize(value) {
      console.log(value);
      this.pageSize = value;
      this.getVerify();
    },
    getVerify(){
      this.$axios.get("verify",{
          params:{
            pageNum:this.pageNum,
            pageSize:this.pageSize
          }
        }).then(response =>{
          console.log(response.data);
          this.pageTotal=response.data.tatol
          this.data6 = response.data.data;
        })
        .catch();
    },
    //查询
    selectSubmit(autitedName) {
      this.$refs[autitedName].validate(valid => {});
    }
  },
  //查询所有
  created: function() {
    this.getVerify()
  //  this.$axios.get("verify")
  //     .then(response => {
  //       console.log(response.data);
  //       this.data6 = response.data.data;
  //     })
  //     .catch();
  }
}
</script>
<style>
  .ssm{
    width: 260px;
  }
  .table{
    position: relative;
    margin-top: 20px
  }
 .ye {
  position: relative;
  margin-top: 30px;
  left: 32%;
}
</style>
